<template>
  <div>
    <div class="apply_title">
      实盘申请
    </div>
    <div class="apply_input">
      <el-input
        v-model="input1"
        placeholder="【必填】 请输入您的姓名"
      ></el-input>
      <el-input
        v-model="input2"
        placeholder="【必填】 请输入您手机号码"
      ></el-input>
      <el-input
        v-model="input3"
        placeholder="【必填】 申请企业/组织/机构/个人名称"
      ></el-input>
      <el-input
        type="textarea"
        :rows="2"
        placeholder="【必填】备注"
        v-model="textarea"
        style="margin-bottom:12px"
      >
      </el-input>
      <el-input
        v-model="input4"
        placeholder="【必填】 验证码"
        style="width:136px"
      ></el-input>
      <!--验证码组件-->
      <s-identify
        :identifyCode="identifyCode"
        :contentWidth="120"
        :contentHeight="40"
      ></s-identify>
      <el-input v-model="input5" placeholder="交易实盘"></el-input>
    </div>
  </div>
</template>
<script>
  import SIdentify from "../components/identy.vue";
export default {
  data() {
    return {
      input1: '',
      input2: '',
      input3: '',
      input4: '',
      input5: '',
      textarea: '',
          const validateCode = (rule, value, callback) => {
      if (this.identifyCode !== value) {
        this.from.code = "";
        this.refreshCode();
        callback(new Error("请输入正确的验证码"));
      } else {
        callback();
      }
    };
    return {
      Rules: {
        code: [
          { required: true, message: '请输入验证码', trigger: 'blur' },
          { validator: validateCode, trigger: 'blur' }
        ]
      },
      from: {},
      identifyCodes: '1234567890',  // 设置验证码为数字验证码，如果想要验证码为字母数字组合，可以加字母，如： identifyCodes: 'ABCD1234567890abcd'
      identifyCode: '',
    }
    }
  }
}
</script>
<style Lang="less" scoped>
.apply_title {
  font-size: 24px;
  text-align: center;
  margin-top: 100px;
}
.apply_input {
  width: 264px;
  margin: 45px auto;
}
.el-input {
  margin-bottom: 12px;
}
</style>
